<template>
    <div>
        <div class="contain">
            <div class="footer-nav">
                <a href="#">联系我们</a>
                <span>|</span>
                <a href="#">监督举报</a>
                <span>|</span>
                <a href="#">企业合作</a>
                <span>|</span>
                <a href="#">生产经营资质</a>
                <span>|</span>
                <a href="#">广告服务</a>
                <span>|</span>
                <a href="#">隐私政策</a>
                <span>|</span>
                <a href="#">客服中心</a>
                <span>|</span>
                <a href="#">招聘信息</a>
                <span>|</span>
                <a href="#">儿童隐私政策</a>
                <span>|</span>
                <a href="#">用户体验计划</a>
                <span>|</span>
                <a href="#">公告专区</a>
            </div>

            <div class="footer-icon">
                <i class="el-icon-service"></i>
            </div>

            <div class="footer-text">
                <span>我们致力于推动网络音乐的发展，相关版权合作请联系：88888888@163.com</span>
                <span>客服电话:117779531(服务时间 08:00-22:00)</span>
                <span>互联网不良信息举报电话：11111771 版权抄袭等不良行为举报</span>
                <span>已得到马栏山广播电视台的许可</span>
                <span>企业地址:天津市软件学院</span>
            </div>

            <div class="footer-copy">
                <span>Kueiq© 音乐人小组的音乐网站 2021-2050, 版权所有 </span>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "Foot"
    }
</script>

<style scoped>
    .contain {
        width: 100%;
        height: 100%;
        border-top: 1px #cccccc solid;
        background-color: #545c64;
        padding: 5px 0 0 0;
        position: relative;
    }

    .footer-nav {
        font-size: 0.8em;
        text-align: center;
        margin: 10px 0 15px 0;
    }

    .footer-nav a {
        color: #9a9a9a;
        display: inline-block;
        margin: 0 20px;
        text-decoration: none;
    }

    .footer-icon {
        height: 65px;
        margin: 0 5px;
        font-size: 40px;
        text-align: center;
        color: #cccccc;
        border-top: 1px solid #008B8B;
    }

    .footer-text {
        color: #a4a4a4;
        text-align: center;
        margin-top: 5px;
        line-height: 18px;
        font-size: 10px;
    }

    .footer-text span {
        display: block;
    }

    .footer-text span:first-child {
        font-weight: bold;
    }

    .footer-copy {
        margin: 0 auto;
        padding-top: 20px;
        text-align: center;
        padding-bottom: 15px;
        font-size: 10px;
    }

    .footer-copy span {
        color: #9a9a9a;
        line-height: 1.5em;
    }
</style>